import $ from 'jquery'

const Toast = {}
Toast.install = function (Vue, options) {
  Vue.prototype.$toast = function (message, type = 'info', duration = 3000) {
    if ($('#toast-container').length === 0) {
      $('body').append('<div id="toast-container"></div>')
    }
    const toastHtml = `<div class="position-fixed top-0 right-0 p-3" style="z-index: 5; right: 0; bottom: 0;">
    <div class="toast show  ${type}">
    <div class="toast-header">
    <strong class="mr-auto">提示</strong>
    <button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
        <span aria-hidden="true">&times;</span>
    </button>
    </div><div class="toast-body">${message}</div>
    </div></div>`
    $('#toast-container').append(toastHtml)
    setTimeout(() => {
      $('.toast').eq(0).remove()
    }, duration + 1000)
  }
}

export default Toast